<!--
 * @Description: mark
 * @Author: wangwangwang
 * @Date: 2020-06-23 20:02:45
 * @LastEditors: wangwangwang
 * @LastEditTime: 2020-07-29 09:48:33
--> 
<template>
	<div class="homeF">
		<div id="homeF" style="width: 100%;height:400px;"></div>
	</div>
</template>

<script>
var echarts = require('echarts');
var time = ''
export default {
	data() {
		return {
			name: ''
		};
	},
	mounted() {
		var myChart = echarts.init(document.getElementById('homeF'));
		var option = {
			title: {
				text: '客户订单',
				left: 'left'
			},
			tooltip: {
				trigger: 'item',
				formatter: '{a} <br/>{b} : {c}'
			},
			legend: {
				data: ['订单量']
			},
			xAxis: {
				axisLine: {
					show: false
				},
				splitLine: {
					show: false
				},
				data: ['1号站', '2号站', '3号站', '4号站', '5号站']
			},
			yAxis: {
				axisLine: {
					show: false
				},
				splitLine: {
					show: false
				}
			},
			series: [
				{
					name: '销量',
					type: 'bar',
					barWidth: 30,
					data: [555, 6520, 4750, 700, 3500, 1000],
					markLine: {
						data: [{ type: 'average', name: '平均订单量' }]
					}
				}
			],

			color: ['#2FD9AC']
		}
		time = setTimeout(function () {
			myChart.setOption(option);
		}, 200)

	},
	methods: {},
	destroyed() {
		clearTimeout(time)
	},
};
</script>

<style lang="scss" scoped>
.homeF {
  padding: $px_24;
}
</style>
